<template>
	<view class="container">

		<view class="">
			<u-subsection fontSize="14px" :list="list" :current="curNow" @change="sectionChange" bgColor="#3c9cff">
			</u-subsection>
		</view>

		<view>
			<u--form labelPosition="left" :model="setMeal" :rules="rules" ref="uForm">
				<u-form-item required label="套餐名称" prop="name" labelWidth="70px">
					<u--input v-model="setMeal.name" border="none"></u--input>
				</u-form-item>

				<u-form-item required label="日封顶价" prop="dayTopPay" labelWidth="70px">
					<u--input v-model="setMeal.dayTopPay" border="none" maxlength="2" type="number"></u--input>
				</u-form-item>

				<u-form-item required label="总费用" prop="totalPay" labelWidth="70px">
					<u--input v-model="setMeal.totalPay" border="none" maxlength="2" type="number"></u--input>
				</u-form-item>

				<view class="myMeal1">
					<view class="" style="width:40%;">
						<u-form-item required label="起步价:" prop="startTime" labelWidth="55px">
							<u--input maxlength="2" v-model="setMeal.startTime" border="none" type="number"></u--input>
						</u-form-item>
					</view>

					<view class="" style="width:40%;">
						<u-form-item label="小时,共" prop="startTotalPay" labelWidth="55px">
							<u--input maxlength="2" v-model="setMeal.startTotalPay" border="none"
								type="number"></u--input>
						</u-form-item>
					</view>

					<view class="">
						<u-form-item label="元">
						</u-form-item>
					</view>
				</view>

				<view class="myMeal1">
					<view class="" style="width:40%;">
						<u-form-item required label="递增价:" prop="incrementTime" borderBottom labelWidth="55px">
							<u--input maxlength="2" v-model="setMeal.incrementTime" border="none"
								type="number"></u--input>
						</u-form-item>
					</view>

					<view class="" style="width:40%;">
						<u-form-item label="每小时" prop="incrementPay" borderBottom labelWidth="55px">
							<u--input maxlength="2" v-model="setMeal.incrementPay" border="none"
								type="number"></u--input>
						</u-form-item>
					</view>

					<view class="">
						<u-form-item label="元">
						</u-form-item>
					</view>
				</view>

				<u-button type="primary" @click="submit">提交</u-button>
			</u--form>
		</view>
	</view>

	</view>
</template>

<script>
	import {
		listMeal,
		getMeal,
		delMeal,
		addMeal,
		updateMeal
	} from "@/api/system/setmeal";
	export default {

		data() {
			return {
				list: ['添加套餐', '查找套餐'],
				curNow: 0,
				setMeal: {
					name: '',
					dayTopPay: '',
					totalPay: '',
					startTime: '',
					startTotalPay: '',
					incrementTime: '',
					incrementPay: '',

				},

				rules: {
					'name': [{
						type: 'string',
						required: true,
						message: '套餐名(唯一)',
						max: 8,
						trigger: ['blur', 'change']
					}],
					'dayTopPay': [{
						type: 'number',
						required: true,
						message: '日封顶多少元',
						trigger: ['blur', 'change']
					}],

					'totalPay': [{
						type: 'number',
						required: true,
						message: '预支付金额',
						trigger: ['blur', 'change']
					}],


					'startTotalPay': [{
						type: 'number',
						required: true,
						message: '金额',
						trigger: ['blur', 'change']
					}],


					'startTime': [{
						type: 'number',
						required: true,
						message: '时间',
						trigger: ['blur', 'change']
					}],

					'incrementTime': [{
						type: 'number',
						required: true,
						message: '时间',
						trigger: ['blur', 'change']
					}],

					'incrementPay': [{
						type: 'number',
						required: true,
						message: '金额',
						trigger: ['blur', 'change']
					}],

				},
			};
		},
		methods: {

			sectionChange(index) {
				let oldCurNow = this.curNow;
				this.curNow = index;
				if (index === 1 && oldCurNow === 0) {
					uni.redirectTo({
						url: '/pages/setMeal/setMealSearch'
					})
				}
			},
			submit() {
				this.$refs.uForm.validate().then(res => {
					uni.$u.toast('校验通过')
					console.log(JSON.stringify(this.setMeal))

					addMeal(this.setMeal).then(res => {
						uni.$u.toast(res.msg);
					}).catch(error => {
						console.log('调用后端添加套餐失败' + JSON.stringify(error))
					})

				}).catch(errors => {
					uni.$u.toast('校验失败 : ' + JSON.stringify(errors))
				})
			},

		}
	}
</script>

<style lang="scss">
	.container {
		//width: 94%;
		padding: 12px;
		display: flex;
		flex-direction: column;
		margin: auto;
		background: linear-gradient(180deg, #f0f0f0 0%, #d0eaff 100%);
		height: 100vh;
	}

	.myMeal1 {
		display: flex;
		justify-content: left;
	}
</style>